import React, { useEffect,useState } from 'react';
import { Form, Input, Select, Button, notification } from 'antd';
import { DatePicker, Space } from 'antd';
import '../../../scss/lhq/supplieredit.scss'
import { useNavigate, useLocation } from 'react-router-dom'
import { supplier_edit } from '../../../tools/lhq/api'

function Supplieredit(props) {
    const [date, setDate] = useState()
    const [from] = Form.useForm();
    // 接收state参数
    var location = useLocation()
    useEffect(() => {
        from.setFieldsValue({
            id: location.state.id,
            brand: location.state.brand,
            name: location.state.name,
            person: location.state.person,
            scope: location.state.scope,
            sn: location.state.sn,
            source: location.state.source,
            number: location.state.number,
        })
    }, [])

    // 日期
    const onChange = (date, dateString) => {
        setDate(dateString);
    };
    var navigate = useNavigate()
    const onFinish = (values) => {
        setDate(date) 
        supplier_edit({ id: location.state.id, date:date,brand:values.brand,name:values.name,
            person:values.person,scope:values.scope,sn:values.sn,source:values.source,number:values.number}).then((res) => {
            notification.success({ message: '编辑成功!' });
            navigate('/index/supplier')
        })
    };

    // 保存编辑
    return (
        <div className='supplieredit'>
            <Form form={from} className='form' initialValues={{ remember: true }} onFinish={onFinish}
                labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
                <Form.Item className='item' label="供应商编号" name="number">
                    <Input placeholder='请输入供应商编号' />
                </Form.Item>
                <Form.Item className='item' label="建档日期" name="date">
                    <Space direction="vertical">
                        <DatePicker onChange={onChange} />
                    </Space>
                </Form.Item>
                <Form.Item className='item' label="供应商来源" name="source">
                    <Input placeholder='请输入商品品牌' />
                </Form.Item>
                <Form.Item className='item' label="负责人" name="person">
                    <Input placeholder='请输入负责人姓名' />
                </Form.Item>
                <Form.Item className='item' label="单位名称" name="name">
                    <Input placeholder='请输入单位名称' />
                </Form.Item>
                <Form.Item className='item' label="品牌" name="brand">
                    <Select
                        placeholder="所有"
                        style={{ width: 120 }}
                        options={[
                            { value: 'Mingnight' },
                            { value: 'Kingnight' },
                            { value: 'Lingnight' }
                        ]}
                    />
                </Form.Item>
                <Form.Item className='item' label="经营范围" name="scope">
                    <Input placeholder='请输入经营范围' />
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                    <Button type="primary" htmlType="submit">保存</Button>
                </Form.Item>
            </Form>
        </div>
    );
}

export default Supplieredit;